<template>
	<div class="mainCont">
		<div class="leftCont">
			<ul class="snav">
				<li v-if="permissions.indexOf(187)  != -1">
					<router-link to="/agreement" v-if="$route.name=='agreement'" @click.native="flushCom"
						:class="$route.name=='agreement'?'active':''">合同管理</router-link>
					<router-link to="/agreement" v-else :class="$route.name=='agreement'?'active':''">合同管理</router-link>
				</li>
				<li v-if="permissions.indexOf(191)  != -1">
					<router-link to="/xminvoice" v-if="$route.name=='xminvoice'" @click.native="flushCom"
						:class="$route.name=='xminvoice'?'active':''">发票管理</router-link>
					<router-link to="/xminvoice" v-else :class="$route.name=='xminvoice'?'active':''">发票管理</router-link>
				</li>
				<li v-if="permissions.indexOf(195)  != -1">
					<router-link to="/supplier" v-if="$route.name=='supplier'" @click.native="flushCom"
						:class="$route.name=='supplier'?'active':''">供应商管理</router-link>
					<router-link to="/supplier" v-else :class="$route.name=='supplier'?'active':''">供应商管理</router-link>
				</li>

				<!-- 		<li>
					<router-link to="/needpay" v-if="$route.name=='needpay'" @click.native="flushCom"
						:class="$route.name=='needpay'?'active':''">合同分析</router-link>
					<router-link to="/needpay" v-else :class="$route.name=='needpay'?'active':''">合同分析</router-link>
				</li> -->

				<li v-if="permissions.indexOf(198)  != -1">
					<a href="#" @click="down5=!down5">统计分析 <span class="iconfont icon-up"
							:style="down5?'transform: rotateZ(180deg);':'transform: rotateZ(0deg);'"></span></a>
					<div class="down" v-if="down5">

						<router-link to="/needpay" v-if="$route.name=='needpay'" @click.native="flushCom"
							:class="$route.name=='needpay'?'active':' '">合同分析
						</router-link>
						<router-link to="/needpay" v-else :class="$route.name=='needpay'?'active':' '">
							合同分析
						</router-link>
						<!-- 
						<router-link to="/ispay" v-if="$route.name=='ispay'" @click.native="flushCom"
							:class="$route.name=='ispay'?'active':' '">已付款分析
						</router-link>
						<router-link to="/ispay" v-else :class="$route.name=='ispay'?'active':' '">
							已付款分析
						</router-link> -->

					</div>
				</li>

				<li v-if="permissions.indexOf(200)  != -1">
					<a href="#" @click="down8=!down8">设置 <span class="iconfont icon-up"
							:style="down8?'transform: rotateZ(180deg);':'transform: rotateZ(0deg);'"></span></a>
					<div class="down" v-if="down8">

						<router-link to="/contract" v-if="$route.name=='contract'" @click.native="flushCom"
							:class="$route.name=='contract'?'active':''">合同类型
						</router-link>
						<router-link to="/contract" v-else :class="$route.name=='contract'?'active':''">合同类型
						</router-link>
						<router-link to="/invoice" v-if="$route.name=='invoice'" @click.native="flushCom"
							:class="$route.name=='invoice'?'active':''">发票类型
						</router-link>
						<router-link to="/invoice" v-else :class="$route.name=='invoice'?'active':''">发票类型
						</router-link>
					</div>
				</li>
			</ul>

		</div>

		<div class="rightCont">
			<router-view>
			</router-view>
		</div>

	</div>
</template>
<script type="text/babel">
	import Vue from 'vue'
	export default {
		name: "",
		data() {
			return {
				down1: true,
				down2: true,
				down3: true,
				down4: true,
				down5: true,
				down6: true,
				down7: true,
				down8: true,
				num:'',
				num2:'',
				permissions:[]
			};
		},
		mounted() {
			var that = this
			// console.log('合同')
			console.log(that.$permissions)
			// if(!this.$route.params.title){
				
			// var url = ''
			
			// var t = setTimeout(function(){
				that.permissions = that.$permissions
			// 	if(that.permissions.indexOf(187) != -1){
			// 		console.log('------------agree----------------------------------')
			// 		that.$router.push('/agreement');
			// 	}else if(that.permissions.indexOf(191) != -1){
			// 		that.$router.push('/xminvoice');
			// 	}else if(that.permissions.indexOf(195) != -1){
			// 		that.$router.push('/supplier');
			// 	}else if(that.permissions.indexOf(198) != -1){
			// 		that.$router.push('/needpay');
			// 	}else if(that.permissions.indexOf(200) != -1){
			// 		that.$router.push('/contract');
			// 	}
			// 	clearTimeout(t)
			// },200)
			// }else{
			// 	that.permissions = that.$permissions
			// }
			
			
		},
		created() {
		},

		methods: {
			flushCom:function(){
				return
		　　},
		
		},

		computed: {
			
		},
	};
</script>
<style lang='less' scoped>
	.bla {
		color: #999;
		margin-left: 10px;
	}

	.bla:hover,
	.blactive {
		background: #4286f5;
		color: #fff;
		border-radius: 20px;
		text-align: center;
		margin-left: 10px;
	}

	/deep/sup {
		top: 0;
		margin-bottom: 3px;
	}

	/deep/.el-badge__content {
		height: auto;
		border: none;
		margin-left: 5px;
	}

	li {
		background: #fff;
		position: relative;
		z-index: 2;

	}

	.rightCont {
		position: relative;
	}

	.icon-up {
		transition: all .3s;
	}

	.down {
		transition: all .3s;
	}
</style>
